@charset "utf-8";
@import "reset";
@import "common";

.wrap{
    main{
        display: flex;
        flex-direction: column;
        .product{
            .purchase{
                margin: vw(36) 0 vw(51);
                .price{
                    float: left;
                    font-size: vw(72);
                    color: $color;
                    line-height: 0.7;
                }
                .purchase-btn{
                    float: right;
                    button{
                        width: vw(111);
                        height: vw(59);
                        line-height: vw(59);
                        background: $color;
                        color: #fff;
                        text-align: center;
                        border-radius: vw(20);
                        border: solid 2px #ff9344;
                    }
                }
            }
            .comment{
                display: flex;
                justify-content: space-between;
                align-items: center;
                .left{
                    >i{
                        font-size: vw(36);
                        color: $color;
                    }
                    span:first-child{
                        font-size: vw(30);
                    }
                    span:last-child{
                        color: $color;
                    }
                }
                p{
                    font-size: vw(26);
                    color: #8e8e8e;
                }
            }
        }
        .extra{
            flex: 1;
            overflow: auto;
            margin-top: vw(36);
            .extra-title{
                padding: 0 vw(5);
                height: vw(67);
                display: flex;
                justify-content: space-between;
                align-items: center;
                background-color: $color;
                color: #fff;
            }
            .item{
                display: flex;
                align-items: center;
                margin-top: vw(10);
                .item-img{
                    width: vw(176);
                }
                .content{
                    flex: 1;
                    display: flex;
                    flex-direction: column;
                    align-self: stretch;
                    justify-content: space-around;
                    margin-left: vw(25);
                    h2{
                        font-size: vw(30);
                    }
                    .stars{
                        >i{
                            color: $color;
                            font-size: vw(36);
                        }
                        span{
                            color: #929292;
                        }
                    }
                    >p{
                        color: #929292;
                        font-size: vw(24);
                    }
                    a{
                        color: $color;
                        font-size: vw(20);
                    }
                }
                .entry{
                    button{
                    width: vw(111);
                    height: vw(59);
                    border-radius: vw(20);
                    border: solid 2px #ff9344;
                    background: $color;
                    color: #fff;
                }
                }
            }
        }
    }
}
